<template>
	<view>
		<uni-nav-bar left-icon="back" right-text="筛选" title="成绩" @clickLeft="backpage()" @clickRight="changelist()">
		</uni-nav-bar>
		<image src="../../../static/img/report_card_background.png" style="width: 750rpx;height: 264rpx; " mode="">
		</image>
		<view class="px-3 position-relative" style="top:-174rpx">
			<view class="p-2 card" v-show="show">
				<view class="text-center mt-4 color333 font30 font-weight-bold">{{ info.examName }}</view>
				<view class="text-center font24 color666 mt-2 mb-5">{{ info.examTime }}</view>
				<view class="flex justify-between px-2 mb-2">
					<view class="">
						<text style="color: #ED5A6A;font-size: 50rpx;">{{ info.myScore }}分</text>
						<!-- <text class="color999 font30">/{{ info.totalScore }}分</text> -->
					</view>
					<!-- <view class="">
						<text style="color: #ED5A6A;font-size: 50rpx;">{{ info.myRanking }}</text>
						<text class="color999 font30">/{{ info.totalNumber }}名</text>
					</view> -->
				</view>
				<view class="flex flex-wrap">
					<view class="flex-column align-center px-2" style="width:285rpx;height: 115rpx;"
						v-for="(item, index) in info.subject" :key="index">
						<view class="flex align-center justify-between">
							<view class="font32 font-weight-bold">{{ item.subName }}</view>
							<!-- <view class="font28" style="color: #ED5A6A">{{ item.subRanking }}名</view> -->
						</view>
						<view class="">
							<text style="color: #ED5A6A;font-size: 28rpx;">{{ item.subScore }}分</text>
							<!-- <text class="color999 font28">/{{ item.subTotalScore }}分</text> -->
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {},
				show: false,
				examRoom: [],
				roomList: [],
				examId: 0
			};
		},
		onLoad() {
			this.getRoom();
		},
		methods: {
			backpage(){
				uni.navigateBack({
					delta:1
				})
			},
			changelist() {
				let this_ = this;
				uni.showActionSheet({
					itemList: this_.roomList,
					success: function(res) {
						this_.examId = this_.examRoom[res.tapIndex].id;
						this_.getData();
					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});
			},
			getRoom() {
				let this_ = this;
				let opts = {
					url: 'Ls/SearchKssjd.shtml'
				};
				let param = {
					token: uni.getStorageSync('userInfo').token,
					class_code: uni.getStorageSync('classcode')
				};
				this_.$http.httpRequest(opts, param).then(
					res => {
						if (res.data.code == '200') {
							this_.examRoom = res.data.data;

							this_.examRoom.forEach((item, index) => {
								if (index == 0) {
									this_.examId = this_.examRoom[index].id
								}
								this_.roomList.push(this_.examRoom[index].name);
								this.getData();
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);

			},
			getData() {
				let this_ = this;
				let opts = {
					url: 'Jz/SearchJzCj.shtml'
				};

				let param = {
					token: uni.getStorageSync('userInfo').token,
					kssjd_code: this_.examId,
					xsUserId: uni.getStorageSync('classUserId')
				};
				this_.$http.httpRequest(opts, param).then(
					res => {
						console.log(JSON.stringify(res));
						if (res.data.code == '200') {
							this_.info = res.data.data;
							this_.show = true;
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			}
		}
	};
</script>

<style>
	.card {
		/* height:921rpx; */
		background: rgba(255, 255, 255, 1);
		box-shadow: 0rpx 3rpx 10rpx 0rpx rgba(0, 0, 0, 0.15);
		border-radius: 10rpx;
	}
</style>
